// src/components/EmployeeContracts.js
import { Table, Button, Space, Input, Tag, Select, Card, Row, Col, Statistic } from '@/utils/antd-imports';
import { SearchOutlined, FileAddOutlined } from '@/utils/icons';
import React from 'react';












const { Search } = Input;
const { Option } = Select;

const EmployeeContracts = () => {
  // 模拟合同数据
  const dataSource = [
    {
      key: '1',
      contractId: 'CT20250001',
      employeeName: '张三',
      contractType: '劳动合同',
      startDate: '2025-01-01',
      endDate: '2028-01-01',
      status: '生效中',
      salary: '15000'
    },
    {
      key: '2',
      contractId: 'CT20250002',
      employeeName: '李四',
      contractType: '实习协议',
      startDate: '2025-06-01',
      endDate: '2025-12-01',
      status: '即将到期',
      salary: '8000'
    },
    {
      key: '3',
      contractId: 'CT20250003',
      employeeName: '王五',
      contractType: '劳动合同',
      startDate: '2025-03-15',
      endDate: '2027-03-15',
      status: '生效中',
      salary: '18000'
    },
    {
      key: '4',
      contractId: 'CT20250004',
      employeeName: '赵六',
      contractType: '顾问协议',
      startDate: '2025-01-01',
      endDate: '2025-12-31',
      status: '已终止',
      salary: '20000'
    }
  ];

  const columns = [
    {
      title: '合同编号',
      dataIndex: 'contractId',
      key: 'contractId'
    },
    {
      title: '员工姓名',
      dataIndex: 'employeeName',
      key: 'employeeName'
    },
    {
      title: '合同类型',
      dataIndex: 'contractType',
      key: 'contractType'
    },
    {
      title: '开始日期',
      dataIndex: 'startDate',
      key: 'startDate'
    },
    {
      title: '结束日期',
      dataIndex: 'endDate',
      key: 'endDate'
    },
    {
      title: '状态',
      dataIndex: 'status',
      key: 'status',
      render: status => (
        <Tag color={status === '生效中' ? 'green' : status === '即将到期' ? 'orange' : 'red'}>
          {status}
        </Tag>
      )
    },
    {
      title: '基本薪资',
      dataIndex: 'salary',
      key: 'salary',
      render: salary => `${salary}元`
    },
    {
      title: '操作',
      key: 'action',
      render: (_, record) => (
        <Space size="middle">
          <Button type="link">查看</Button>
          <Button type="link">续签</Button>
          <Button type="link" danger>终止</Button>
        </Space>
      )
    }
  ];

  // 统计指标数据
  const stats = {
    totalContracts: dataSource.length,
    activeContracts: dataSource.filter(c => c.status === '生效中').length,
    expiringContracts: dataSource.filter(c => c.status === '即将到期').length,
    terminatedContracts: dataSource.filter(c => c.status === '已终止').length,
    avgSalary: Math.round(dataSource.reduce((sum, c) => sum + parseInt(c.salary), 0) / dataSource.length)
  };

  return (
    <div style={{ padding: 24 }}>
      <h1>员工合同管理</h1>
      
      {/* 统计指标卡片 */}
      <Row gutter={16} style={{ marginBottom: 24 }}>
        <Col span={6}>
          <Card>
            <Statistic
              title="合同总数"
              value={stats.totalContracts}
              valueStyle={{ color: '#1890ff' }}
            />
          </Card>
        </Col>
        <Col span={6}>
          <Card>
            <Statistic
              title="生效中合同"
              value={stats.activeContracts}
              valueStyle={{ color: '#52c41a' }}
            />
          </Card>
        </Col>
        <Col span={6}>
          <Card>
            <Statistic
              title="即将到期合同"
              value={stats.expiringContracts}
              valueStyle={{ color: '#faad14' }}
            />
          </Card>
        </Col>
        <Col span={6}>
          <Card>
            <Statistic
              title="平均薪资"
              value={stats.avgSalary}
              prefix="¥"
              valueStyle={{ color: '#722ed1' }}
            />
          </Card>
        </Col>
      </Row>

      {/* 搜索和过滤区域 */}
      <div style={{ marginBottom: 16, display: 'flex', justifyContent: 'space-between' }}>
        <div>
          <Search
            placeholder="搜索员工姓名/合同编号"
            allowClear
            enterButton={<SearchOutlined />}
            style={{ width: 300, marginRight: 16 }}
          />
          <Select placeholder="合同类型" style={{ width: 150, marginRight: 16 }}>
            <Option value="all">全部类型</Option>
            <Option value="labor">劳动合同</Option>
            <Option value="internship">实习协议</Option>
            <Option value="consultant">顾问协议</Option>
          </Select>
          <Select placeholder="合同状态" style={{ width: 150 }}>
            <Option value="all">全部状态</Option>
            <Option value="active">生效中</Option>
            <Option value="expiring">即将到期</Option>
            <Option value="terminated">已终止</Option>
          </Select>
        </div>
        <Button type="primary" icon={<FileAddOutlined />}>新建合同</Button>
      </div>

      {/* 合同表格 */}
      <Table 
        dataSource={dataSource} 
        columns={columns} 
        bordered
        pagination={{ pageSize: 10 }}
      />
    </div>
  );
};

export default EmployeeContracts;